<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>简洁列表音乐播放器</title>
    <meta name="keywords" content="音乐mp3播放器" />
<meta name="description" content="简洁列表播放器" />
    <link rel="stylesheet" type="text/css" href="Css/tplayer.css" />
    <link rel="stylesheet" type="text/css" href="Plugins/FontAwesome4.1/css/font-awesome.min.css" />
    <script src="Js/jquery.js"></script>
    <script src="Js/jquery-ui.js"></script>
    <script src="Js/tPlayer.js"></script>
</head>
<body>

<div class="myplayer">
	<!-- 代码 开始 -->
    <div id="t_wrapper">
        <div id="t_cover">
        	<img src="Images/logo.png" alt="">
        </div>
    	<div id="t_top">
    		<div id="t_title_info">
    			<span class="artist"></span>
    			<span class="title"></span>
    		</div>
    	</div>
    	<div id="t_middle">
    		<div id="play"></div>
    		<div id="pause" class="hidden">
    		</div>
    		<div class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all" id="t_progress">
                <div id="trackInfo">
                    <div id="error">
    				</div>
                    <div id="current">0:00</div>
                    <div id="duration">0:00</div>
    			</div>
    			<div style="width: 0%;" class="ui-slider-range ui-widget-header ui-corner-all ui-slider-range-min"></div>
            	<span style="left: 0%;" class="ui-slider-handle ui-state-default ui-corner-all" tabindex="0"></span>
            </div>
    		<span id="prev"></span>
            <span id="next"></span>
    	</div>
    	<div id="t_bottom">
            <div id="range">
                <div id="val"></div>
                <div id="vol"></div>
                <div id="rangeVal"></div>
            </div>
            <div id="t_pls_show" class="noselectpls"></div>
    	</div>
    </div>
    <div id="playlist">
		<ul>
			<li t_cover="https://s1.ax1x.com/2022/03/19/qENSCF.png" t_artist="周深" t_name="大鱼 《大鱼海棠》"> 
				<a href="#">周深 – 大鱼 《大鱼海棠》</a>
				<audio preload="none">
					<source src="https://gitee.com/sansuidouer/Mushic/raw/master/Mushic/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E7%A8%BB%E9%A6%99.mp3" type="audio/mp3">
					<source src="http://www.datouwang.com/" type="audio/ogg; codecs=vorbis">
				</audio>
			</li>
			<li t_cover="dengziqi.jpg" t_artist="邓紫棋" t_name="喜欢你">
				<a href="#">邓紫棋 – 喜欢你</a>
				<audio preload="none">
					<source src="http://antiserver.kuwo.cn/anti.s?format=aac|mp3&rid=5245130&type=convert_url&response=res" type="audio/mp3">
					<source src="http://www.datouwang.com/" type="audio/ogg; codecs=vorbis">
				</audio>
			</li>
			<li t_cover="zhoujielun.jpg" t_artist="周杰伦" t_name="最长的电影">
				<a href="#">周杰伦 – 最长的电影</a>
				<audio preload="none">
					<source src="http://sc.111ttt.com/up/mp3/21567/82A1E2ED54A07B173CDEAFD38DF63C4F.mp3" type="audio/mp3">
					<source src="http://www.datouwang.com/" type="audio/ogg; codecs=vorbis">
				</audio>
			</li>
			<li t_cover="dengziqi.jpg" t_artist="男生版" t_name="泡沫">
				<a href="#">男生版 – 泡沫</a>
				<audio preload="none">
					<source src="http://sc.111ttt.com/up/mp3/325955/BEBEB47B017439208D11F62558E9A9D1.mp3" type="audio/mp3">
					<source src="http://www.datouwang.com/" type="audio/ogg; codecs=vorbis">
				</audio>
			</li>
			<li t_cover="taozhe.jpg" t_artist="陶喆" t_name="爱我还说他">
				<a href="#">陶喆 – 爱我还说他</a>
				<audio preload="none">
					<source src="http://sc.111ttt.com/up/mp3/75773/A444FCBC6F3003067D83C5CD83DB191B.mp3" type="audio/mp3">
					<source src="http://www.datouwang.com/" type="audio/ogg; codecs=vorbis">
				</audio>
			</li>
		</ul>
    </div>
	<!-- 代码 结束 -->
</div>

</body>
</html>